@import "normalize.css";
@import "common.css";
@import "flexnormalize.css";

@media screen and (min-width: 1366px) {
    html {
        font-size: 136.6px!important;
        body {
            min-width: 320px;
            max-width: 1366px;
            /* flexible 给我们划分了 10 等份 */
            width: 10rem;
            margin: 0 auto;
            font-family: Arial, Helvetica;
        }
    }
}

/* head */



.banner{
    display: flex;
    // min-width: 1200px;
    height: 2.647059rem;
    background-color: rgba(0, 0, 0, .8);
    flex-direction: column;
    align-content: center;
    .canvas {
        position: relative;
        height: 350px;
        // background-color: #f1f1f1;
        canvas {
            position: absolute !important;
            z-index: -1 !important;
            width: 100%;
            height: 350px !important;
        }
    }
    .head {
        height: .485294rem;
        border-bottom: .007353rem solid #ccc;
        padding: 0 .220588rem;
        z-index: 10;
        .head-logo {
            padding-top: .088235rem;
            margin: 0;
                img{
                    width: 1.691176rem;
                    height: .220588rem;
                }

        }
        .head-login,
        .head-register {
            /* float: left; */
            /* 块级格式上下文 */
            border: .007353rem solid #ccc;
            padding: .029412rem .088235rem;
            border-radius: .220588rem;
        }
        .head-nav {
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            li {
                float: left;
                margin: 0 .147059rem;
                line-height: .485294rem;
                list-style: none;
                cursor: pointer;
                a {
                    padding-bottom: .154412rem;
                    color: #fff;
                }
                .active {
                    border-bottom: .014706rem solid white;
                    font-size: .117647rem;
                }
            }

        }
        .head-register {
            background-color: #ed510a;
            border: none;
            margin: .139706rem 0;
            user-select: none;
            .head-register a {
                color: #fff;
            }
        }
        .sign {
            padding: .029412rem .088235rem;
            border-radius: .147059rem;
            margin: .139706rem;
            border: .007353rem solid #aac6ef;
            user-select: none;
            a {
                color: #fff;
            }
        }
    }
    .banner-mask{
        height: .75rem;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        .top-title{
            font-size: .264706rem;
            color: #fff;
            line-height: .397059rem;
            padding-top: 1.044118rem;
        }
        .top-des{
            font-size: .102941rem;
            color: #fff;
            line-height: .25rem;
        }
        .top-case{
            font-size: .117647rem;
            color: #fff;
            line-height: .191176rem;
        }

        

    }
}
.content{
    padding-top: .220588rem;
    padding-bottom: .441176rem;
    border-bottom: 1px solid #efefef;
    background-color: #f8f8f8;
    .center{
        text-align: left;
        width: 8.823529rem;
        .content-body{
            width: 8.294118rem;
            div{
                margin-bottom: .132353rem;
                .common-title{
                    font-size: .117647rem;
                    line-height: .191176rem;
                    color: #000;
                    padding-bottom: .073529rem;
                    .english-txt{
                        font-size: .088235rem;
                        color: #999;
                    }
                    .line{
                        width: .102941rem;
                        height: .014706rem;
                        background-color: #1271ef;
                        margin-top: .036765rem;
                    }
                }
                .case{
                    display: flex;
                    // 可以换行
                    flex-wrap: wrap;
                    justify-content: space-between;
                    .case-item{
                        display: flex;
                        width: 2.617647rem;
                        height: 2.514706rem;
                        padding: .073529rem;
                        border: .007353rem solid #eee;
                        box-sizing: border-box;

                        .item-link{
                            display: flex;
                            // y轴作为主轴
                            flex-direction: column;
                            width: 2.617647rem;
                            height: 2.514706rem;
                            // y轴从上往下
                            // align-items: flex-start;
                            justify-content: space-around;

                            .pic{
                                width: 2.455882rem;
                                height: 1.066176rem;
                            }
                            .item-name{
                                font-size: .117647rem;
                                line-height: .294118rem;
                                color: #181818;
                            }
                            .item-desc{
                                font-size: .088235rem;
                                line-height: .117647rem;
                                color: #666;
                                display: -webkit-box;
                                -webkit-box-orient: vertical;
                                -webkit-line-clamp: 4;
                                overflow: hidden;
                            }
                            .btm-link{
                                .link-text{
                                    font-size: .088235rem;
                                    line-height: .235294rem;
                                    color: #1271ef;
                                }
                            }
                        }
                    }
                }

            }

            .morepartners{
                .case{
                    height: 3.088235rem;
                    .partners-item{
                        display: flex;
                        justify-content: center;
                        // 解决父justify-content:space-between
                        // 最后一行不右对齐问题
                        margin: 0 auto;
                        align-items: center;
                        width: 2.602941rem;
                        height: .882353rem;
                        background-color: #fff;
                        img{
                            width: .963235rem;
                            height: .294118rem;
                        }
                    }
                }
            }
        }
    }

}
// 右边电梯列表
.aside{
    position: absolute;
    top: 2.941176rem;
    left: 50%;
    margin-left: 4.264706rem;
    width: .529412rem;
    // margin-top: 32px;
    .nav-item{
        position: relative;
        font-size: .102941rem;
        line-height: .294118rem;
        cursor: pointer;
    }
    .icon-kefu:before {
        content: "\f7ee";
        color: #00a0e9;
        margin-left: .088235rem;
        font-size: .154412rem;    
    }
    .active{
        &::after{
            position: absolute;
            top: .147059rem;
            left: -0.102941rem;
            content: "";
            width: .058824rem;
            height: .014706rem;
            background-color: #1271ef;
        }
    }
}
.floorPosition{
    position: fixed;
    top: 30px;
}


